<template>
  <div>
    <!-- 顶部导航栏 -->
    <van-nav-bar title="设置" left-arrow @click-left="onClickLeft">
    </van-nav-bar>
    <!-- 功能单元格 -->
    <van-cell-group inset>
      <van-cell size="large" title="个人信息" is-link to="/commoninfo">
      </van-cell>
      <van-cell size="large" title="用户协议" is-link @click="showPopup1">
      </van-cell
      ><van-popup
        v-model="show1"
        round
        closeable
        position="bottom"
        :style="{ height: '50%' }"
        ><div class="treaty">
          <h3 style="text-align: center">希尔顿APP用户协议</h3>
          <h4 style="text-align: center">Treaty of Using Hilton APP</h4>
          <p>
            &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; Hilton Domestic Operating
            Company
            Inc.是作为所有宾客数据的数据控制者的希尔顿实体，并处理希尔顿的营销等活动。Hilton
            Reservations
            Worldwide，L.L.C.负责处理您在希尔顿酒店进行预订时提供的数据，并且是该信息的数据控制者。
            <br />
            &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; Hilton Honors Worldwide
            LLC隶属于Hilton Domestic Operating Company
            Inc.，负责运营希尔顿荣誉客会忠诚计划，并且是该计划的数据控制者。
          </p>
        </div>
      </van-popup>
      <van-cell size="large" title="隐私政策" is-link @click="showPopup2">
      </van-cell
      ><van-popup
        v-model="show2"
        round
        closeable
        position="bottom"
        :style="{ height: '50%' }"
        ><div class="policy">
          <h3 style="text-align: center">希尔顿APP隐私政策</h3>
          <h4 style="text-align: center">Policy of Using Hilton APP</h4>
          <p>
            &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; Hilton Domestic Operating
            Company
            Inc.是作为所有宾客数据的数据控制者的希尔顿实体，并处理希尔顿的营销等活动。Hilton
            Reservations
            Worldwide，L.L.C.负责处理您在希尔顿酒店进行预订时提供的数据，并且是该信息的数据控制者。
            <br />
            &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; Hilton Honors Worldwide
            LLC隶属于Hilton Domestic Operating Company
            Inc.，负责运营希尔顿荣誉客会忠诚计划，并且是该计划的数据控制者。
          </p>
        </div>
      </van-popup>
      <van-cell size="large" title="使用条款" is-link @click="showPopup3">
      </van-cell
      ><van-popup
        v-model="show3"
        round
        closeable
        position="bottom"
        :style="{ height: '50%' }"
      >
        <div class="terms">
          <h3 style="text-align: center">希尔顿APP使用条款</h3>
          <h4 style="text-align: center">Terms of Using Hilton APP</h4>
          <p>
            &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; Hilton Domestic Operating
            Company
            Inc.是作为所有宾客数据的数据控制者的希尔顿实体，并处理希尔顿的营销等活动。Hilton
            Reservations
            Worldwide，L.L.C.负责处理您在希尔顿酒店进行预订时提供的数据，并且是该信息的数据控制者。
            <br />
            &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; Hilton Honors Worldwide
            LLC隶属于Hilton Domestic Operating Company
            Inc.，负责运营希尔顿荣誉客会忠诚计划，并且是该计划的数据控制者。
          </p>
        </div>
      </van-popup>
      <van-cell
        size="large"
        title="分享APP"
        is-link
        @click="showShare = true"
      />
      <van-share-sheet
        v-model="showShare"
        title="立即分享给好友"
        :options="options"
        @select="onSelect"
      />
      <van-cell
        size="large"
        title="关于希尔顿"
        is-link
        @click="showPopup4"
      ></van-cell
      ><van-popup
        v-model="show4"
        round
        closeable
        position="bottom"
        :style="{ height: '50%' }"
      >
        <div class="about">
          <h3 style="text-align: center">希尔顿酒店及度假村</h3>
          <h4 style="text-align: center">Hilton Worldwide Holdings Inc.</h4>
          <p>
            &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;作为业内知名的品牌，希尔顿酒店及度假村是时尚现代并高瞻远瞩的全球酒店业典范。凭借对产品、设施和
            服务的不断创新，拥有 92年历史的希尔顿将继续引领行业的发展方向。
            <br />
            &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;我们利用智能设计、创新餐厅理念、热情周到的服务以及对全球社区的承诺，让旅行变得更加轻松。希尔顿目前所服务的国家/地区超过任何提供全方位综合性服务的其他酒店品牌，在遍及六大洲的79
            个国家/地区拥有 570 多家酒店及度假酒店。
          </p>
        </div>
      </van-popup>
      <van-cell size="large" title="版本信息" value="已是最新版本"> </van-cell>
    </van-cell-group>
  </div>
</template>
<style lang="scss" scoped>
::v-deep .van-nav-bar__content {
  background-color: #fff;
}
::v-deep .van-icon-arrow-left:before {
  color: #000;
}
::v-deep .van-nav-bar__title {
  color: #000;
  font-size: 1.125rem;
}
::v-deep .van-button--primary {
  color: #fff;
  background-color: #f5b400;
  border: 0.0625rem solid #f5b400;
}
//单元格
.van-cell {
  line-height: 2rem;
  border: 0.125rem solid whitesmoke;
  font-size: 0.625rem;
  padding: 0.7rem 1rem;
  margin-top: 1rem;
  border-radius: 0.9375rem;
}
::v-deep .van-hairline--bottom::after {
  border-bottom-width: 0rem;
}
//按钮
::v-deep .van-button--large {
  width: 70%;
  margin: 0 auto;
}
.treaty > p {
  padding: 1.25rem;
  padding-top: 0.125rem;
  color: grey;
}
.policy > p {
  padding: 1.25rem;
  padding-top: 0.125rem;
  color: grey;
}
.terms > p {
  padding: 1.25rem;
  padding-top: 0.125rem;
  color: grey;
}
.about > p {
  padding: 1.25rem;
  padding-top: 0.125rem;
  color: grey;
}
</style>
<script>
export default {
  data() {
    return {
      show1: false,
      show2: false,
      show3: false,
      show4: false,
      showShare: false,
      options: [
        { name: "微信", icon: "wechat" },
        { name: "微博", icon: "weibo" },
        { name: "复制链接", icon: "link" },
        { name: "分享海报", icon: "poster" },
        { name: "二维码", icon: "qrcode" },
      ],
    };
  },

  methods: {
    onClickLeft() {
      this.$router.go(-1);
    },
    showPopup1() {
      this.show1 = true;
    },
    showPopup2() {
      this.show2 = true;
    },
    showPopup3() {
      this.show3 = true;
    },
    showPopup4() {
      this.show4 = true;
    },
    onSelect(option) {
      Toast(option.name);
      this.showShare = false;
    },
  },
};
</script>
